<header class="flex items-center mb-6">
  <div>
    <h1 class="crayons-title"><%= @bot.name %></h1>
    <p class="color-secondary">Community Bot Details</p>
  </div>
  <div class="ml-auto flex gap-2">
    <%= link_to "Back to Bots", admin_subforem_community_bots_path(@subforem), class: "crayons-btn crayons-btn--outlined" %>
    <%= link_to "Delete Bot", admin_subforem_community_bot_path(@subforem, @bot), 
        method: :delete, 
        data: { confirm: "Are you sure you want to delete this bot? This action cannot be undone." },
        class: "crayons-btn crayons-btn--danger" %>
  </div>
</header>

<div class="grid gap-6">
  <!-- Bot Details Card -->
  <div class="crayons-card p-6">
    <h2 class="crayons-subtitle-1 mb-4">Bot Information</h2>
    <div class="grid gap-4 m:grid-cols-2">
      <div class="crayons-field">
        <strong class="crayons-field__label">Name:</strong>
        <p class="mt-1"><%= @bot.name %></p>
      </div>
      
      <div class="crayons-field">
        <strong class="crayons-field__label">Username:</strong>
        <p class="mt-1">@<%= @bot.username %></p>
      </div>
      
      <div class="crayons-field">
        <strong class="crayons-field__label">Email:</strong>
        <p class="mt-1"><%= @bot.email %></p>
      </div>
      
      <div class="crayons-field">
        <strong class="crayons-field__label">Created:</strong>
        <p class="mt-1"><%= @bot.created_at.strftime("%B %d, %Y at %I:%M %p") %></p>
      </div>
      
      <div class="crayons-field">
        <strong class="crayons-field__label">Status:</strong>
        <p class="mt-1">
          <span class="c-indicator c-indicator--success">Active</span>
        </p>
      </div>
      
      <div class="crayons-field">
        <strong class="crayons-field__label">Type:</strong>
        <p class="mt-1">Community Bot</p>
      </div>
    </div>
  </div>

  <!-- API Secrets Card -->
  <div class="crayons-card p-6">
    <div class="flex items-center justify-between mb-4">
      <h2 class="crayons-subtitle-1">API Secrets</h2>
      <span class="text-sm color-secondary"><%= pluralize(@api_secrets.count, 'secret') %></span>
    </div>
    
    <% if @api_secrets.empty? %>
      <p class="color-secondary">No API secrets found for this bot.</p>
    <% else %>
      <div class="space-y-4">
        <% @api_secrets.each do |secret| %>
          <div class="border border-base-20 rounded-lg p-4">
            <div class="flex items-center justify-between mb-2">
              <h3 class="font-semibold"><%= secret.description %></h3>
              <span class="text-xs color-secondary">Created <%= time_ago_in_words(secret.created_at) %> ago</span>
            </div>
            <div class="bg-base-10 p-3 rounded">
              <div class="flex items-center justify-between">
                <code class="font-mono text-sm break-all"><%= secret.secret %></code>
                <button class="ml-2 text-xs color-secondary hover:color-base-70" 
                        onclick="navigator.clipboard.writeText('<%= secret.secret %>').then(() => alert('API key copied to clipboard!'))">
                  Copy
                </button>
              </div>
            </div>
            <p class="text-xs color-secondary mt-2">
              Use this API key in the <code>api-key</code> header for API requests
            </p>
          </div>
        <% end %>
      </div>
    <% end %>
  </div>

  <!-- Activity Card -->
  <div class="crayons-card p-6">
    <h2 class="crayons-subtitle-1 mb-4">Bot Activity</h2>
    <div class="grid gap-4 m:grid-cols-3">
      <div class="text-center">
        <div class="text-2xl font-bold"><%= @bot.articles_count %></div>
        <div class="text-sm color-secondary">Articles</div>
      </div>
      <div class="text-center">
        <div class="text-2xl font-bold"><%= @bot.comments_count %></div>
        <div class="text-sm color-secondary">Comments</div>
      </div>
      <div class="text-center">
        <div class="text-2xl font-bold"><%= @bot.reactions_count %></div>
        <div class="text-sm color-secondary">Reactions</div>
      </div>
    </div>
  </div>

  <!-- Scheduled Automations Card -->
  <div class="crayons-card p-6">
    <div class="flex items-center justify-between mb-4">
      <h2 class="crayons-subtitle-1">Scheduled Automations</h2>
      <div class="flex gap-2">
        <span class="text-sm color-secondary"><%= pluralize(@bot.scheduled_automations.count, 'automation') %></span>
        <%= link_to "Manage Automations", admin_subforem_community_bot_scheduled_automations_path(@subforem, @bot), class: "crayons-btn crayons-btn--s" %>
      </div>
    </div>
    
    <% if @bot.scheduled_automations.empty? %>
      <p class="color-secondary">No scheduled automations configured for this bot.</p>
      <%= link_to "Create your first automation", new_admin_subforem_community_bot_scheduled_automation_path(@subforem, @bot), class: "crayons-btn mt-4" %>
    <% else %>
      <div class="space-y-3">
        <% @bot.scheduled_automations.limit(3).each do |automation| %>
          <div class="border border-base-20 rounded-lg p-3 <%= 'opacity-50' unless automation.enabled? %>">
            <div class="flex items-center justify-between">
              <div>
                <div class="font-semibold"><%= automation.service_name.titleize %> → <%= automation.action.humanize %></div>
                <div class="text-sm color-secondary">
                  <%= automation.frequency.humanize %> 
                  <% if automation.next_run_at %>
                    • Next run: <%= time_ago_in_words(automation.next_run_at) %> <%= automation.next_run_at > Time.current ? 'from now' : 'ago' %>
                  <% end %>
                </div>
              </div>
              <% unless automation.enabled? %>
                <span class="crayons-tag crayons-tag--outlined">Disabled</span>
              <% end %>
            </div>
          </div>
        <% end %>
        <% if @bot.scheduled_automations.count > 3 %>
          <div class="text-center pt-2">
            <%= link_to "View all #{@bot.scheduled_automations.count} automations →", admin_subforem_community_bot_scheduled_automations_path(@subforem, @bot), class: "text-sm color-secondary hover:color-base-70" %>
          </div>
        <% end %>
      </div>
    <% end %>
  </div>
</div>


